<template>
  <svg
    aria-hidden="true"
    :width="width ? width : size"
    :height="height ? height : size"
  >
    <use :xlink:href="`#icon-${name}`" />
  </svg>
</template>

<script setup lang="ts">
interface Props {
  name: string;
  size?: number | string;
  color?: string;
  width?: number | string;
  height?: number | string;
}

const props = withDefaults(defineProps<Props>(), {
  size: 20,
  color: "currentColor",
});
</script>
